<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>

    </title>
    <style>
        .box{
            width: 1000px;
            height: 1000px;
            background-color: rgb(218, 175, 175);
            margin: 40px  auto;
            text-align: center;
            background-image: url(./img/bg.jpg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            overflow: auto;
            background-attachment: inherit;
            /*hidden  隐藏*/
            /*scroll 不管有没有溢出 都要显示滚动条*/
              /*auto 溢出显示滚动条 每一处不显示*/
        }
        .child{
           width: 1200px;
           height: 100px;
            background-color: red;
        }
        
    </style>
</head>
<body>
<div class="box">
    
    <div class="child">
        <h1>顶部</h1>
        <h2>底部</h2>
    </div>
</div>
</body>
</html>